<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="robots" content="index, follow"/>
    <title>${field.typetitle}</title>
    <meta name="keywords" content="${field.typekeyword}">
    <meta name="description" content="${field.typedescrip}">
    <meta http-equiv="Cache-Control" content="no-transform"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="applicable-device" content="pc,mobile"/>
    <link href="/{ms:global.style/}css/style.css" rel="stylesheet"/>
    <link href="/{ms:global.style/}css/css.css" rel="stylesheet"/>
    <link href="/{ms:global.style/}css/supplyChain.css" rel="stylesheet">
    <link href="/{ms:global.style/}css/cateringAndBar.css" rel="stylesheet" />
    <script src="/{ms:global.style/}js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="/{ms:global.style/}js/jquery.superslide.2.1.1.js">//pc导航</script>
    <script src="/{ms:global.style/}js/anim.js">//动画</script>
    <script type="text/javascript" src="/{ms:global.style/}js/basic.js"></script>
    <script type="text/javascript" src="/static/plugins/vue/2.6.9/vue.min.js"></script>
    <!--引入element-ui库-->
    <script src="/static/plugins/element-ui/2.15.8/index.min.js"></script>
    <link rel="stylesheet" href="/static/plugins/element-ui/2.15.8/theme-chalk/index.min.css" />
</head>
<body>
<#include "header.htm" />
<div class="top_warp">
    <div class="top_banner">
        <img src="{@ms:file field.typelitpic/}" alt="故事在酒里" />
    </div>
</div>
<!--正文begin-->
<div class="warp_supplyChain1 main_warp">
    {ms:data dataid=1861318429156122625}
    <h2 class="warp_mainTitle">
        ${field.title}
    </h2>
    <div class="warp1_main_Content">
        <div class="warp_img">
            <img src="{@ms:file field.litpic/}" alt="">
        </div>
        <div class="warp_content">
            ${field.descrip}
        </div>
    </div>
    {/ms:data}
</div>
<div class="warp_supplyChain2 main_warp">
    {ms:channel type='self' typeid=1861224012747448322}
    <h2 class="warp_mainTitle">
        ${field.typetitle}
    </h2>
    <p class="warp_smallTitle">
        ${field.typeshorttitle}
    </p>
    {/ms:channel}
    <div class="content_list">
        {ms:arclist typeid="1861224012747448322"}
        <div class="list_item">
            <div class="main_image">
                <img src="{@ms:file field.litpic/}" alt="">
            </div>
            <div class="main_contentBox">
                <div class="title">
                    <span class="titleOrderIcon"></span>${field.title}
                </div>
                <div class="content">
                    ${field.descrip}
                </div>
            </div>
        </div>
        {/ms:arclist}
    </div>
</div>
<div class="warp_supplyChain3 main_warp">
    {ms:channel type='self' typeid="1861324221980692482"}
    <div class="warp_bgImg">
        <img src="{@ms:file field.typelitpic/}" alt="">
    </div>
    <p>${field.typedescrip}</p>
    {/ms:channel}
</div>
<div class="warp_supplyChain4 main_warp">
    <div class="warp_fromBox">
        <div class="input_mianBox">
            <div id="form" v-loading="loading" v-cloak>
                <el-form ref="form" :model="form" :rules="rules" label-position="top" hide-required-asterisk="true">
                    <el-row>
                        <el-form-item label="联系方式 *" prop="phone">
                            <el-input v-model="form.phone"> </el-input>
                        </el-form-item>
                        <el-form-item label="联系人名称" prop="name">
                            <el-input v-model="form.name"> </el-input>
                        </el-form-item>
                    </el-row>
                    <el-row class="center">
                        <el-button @click="submit" :loading="loading">
                          {{loading?'提交中':'立刻获取专属方案'}}
                        </el-button>
                      </el-row>
                </el-form>
            </div>
        </div>
    </div>
    <div class="code_box">
        {ms:channel type='self' typeid="1861238291819208705"}
        <img src="{@ms:file field.typelitpic/}" alt="">
        <p>${field.typetitle}</p>
        {/ms:channel}
    </div>
</div>
<!--正文end-->
<#include "footer.htm" />
<script>
    var form = new Vue({
        el: "#form",
        data: function () {
            return {
                loading: false,
                //表单数据
                form: {
                    phone: "",
                    name: "",
                },
                rules: {
                    phone: [
                        {
                            required: true,
                            message: "联系电话不能为空",
                        },
                        {
                            pattern:
                                /^([0-9]{3,4}-)?[0-9]{7,8}$|^\d{3,4}-\d{3,4}-\d{3,4}$|^1[0-9]{10}$/,
                            message: "联系电话格式不匹配",
                        },
                    ],
                },
            };
        },
        watch: {},
        components: {},
        computed: {},
        methods: {
            submit: function (e) {
                e.preventDefault(); //阻止默认事件跳转
                var that = this;
                that.$refs.form.validate(function (valid) {
                    // if (valid) {
                    //   that.form.modelName = "留言板"; //modelName需要填写自己的模型昵称
                    //   ms.http
                    //     .post("/mdiy/form/data/save.do", that.form)
                    //     .then(function (res) {
                    //       if (res.result) {
                    //         that.$notify({
                    //           title: "成功",
                    //           type: "success",
                    //           message: "感谢您的参与!",
                    //         });
                    //         that.$refs.form.resetFields(); //清空表单
                    //       } else {
                    //         if (res.msg == "验证码错误!") {
                    //           that.$notify({
                    //             title: "失败",
                    //             message: res.msg,
                    //             type: "warning",
                    //           });
                    //         } else {
                    //           that.$alert(
                    //             '需要安装留言插件才能使用，请先进入后台MStore安装留言插件使用。<a href="http://store.mingsoft.net/#/detail?id=310&type=plugin" style="color:#409EFF " target="_blank">查看留言插件</a>',
                    //             "留言插件提示",
                    //             {
                    //               dangerouslyUseHTMLString: true,
                    //             }
                    //           );
                    //         }
                    //       }
                    //     });
                    // }
                });
            },
        },
    });
</script>
<script language="javascript" src="/{ms:global.style/}js/foot.js"></script><!--尾部end-->
</body>
</html>
